<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        div {
            width: 100px;
            height: 100px;
            margin: 100px auto;
            background-color: #ccc;
        }

        button {
            position: absolute;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 40px;

        }
    </style>
</head>

<body>
    <div>
    </div>
    <button>按钮</button>

    <script>
        // 16进制随机颜色，
        // 题目描述：使用Math对象，制作一个16进制的随机颜色
        // 题目提示：16进制包括 “ 0  1  2  3  4  5  6  7  8  9  A  B  C  D  E  F ”
        // 例： “#f23a4b”
        var btn = document.querySelector('button');
        var div = document.querySelector('div');


        // btn.onclick = function () {
        //     function random(max, min) {
        //         // var a, b, c, d, e, f;
        //         var num = Math.floor(Math.random() * (max - min + 1)) + min;
        //         if (num === 10) {
        //             num = 'a';
        //         } else if (num === 11) {
        //             num = 'b';
        //         } else if (num === 12) {
        //             num = 'c';
        //         } else if (num === 13) {
        //             num = 'd';
        //         } else if (num === 14) {
        //             num = 'e';
        //         } else if (num === 15) {
        //             num = 'f';
        //         }
        //         return num;
        //     }
        //     var n1 = random(15, 0);
        //     var n2 = random(15, 0);
        //     var n3 = random(15, 0);
        //     var n4 = random(15, 0);
        //     var n5 = random(15, 0);
        //     var n6 = random(15, 0);
        //     div.style.backgroundColor = '#' + n1 + '' + n2 + '' + n3 + '' + n4 + '' + n5 + '' + n6 + '';
        //     console.log('#' + n1 + '' + n2 + '' + n3 + '' + n4 + '' + n5 + '' + n6 + '');
        // }

    </script>
</body>

</html>